<template>
  <div class="sum" style="width: 100%;height: 100%;overflow-x:auto;overflow-y:auto">
  <a-row class="row_1" style="height: 31.5%;width: 105%">
    <div class="top_all">
      <div>
        <strong><label class="title1">齿轮参数</label></strong>
      </div>

      <div style="display: flex;margin-left: 8px;margin-top: 3px;height: 100%;width: 100%;;position: relative">
        <div style="text-align:left;margin-right: 50px">
          <ul style="height: 100%;width: 20%;position: absolute;left: 0;margin-left: 8px">
            <li>太阳轮齿数</li>
            <li>行星轮齿数</li>
            <li>齿圈齿数</li>
            <li>行星轮个数</li>
          </ul>
          <ul style="height: 100%;width: 20%;position: absolute;left: 20%">
            <li>法向模数(mm)</li>
            <li>螺旋角(°)</li>
            <li>端面工作压力角(°)</li>
          </ul>
          <ul style="height: 100%;width: 20%;position: absolute;left: 40%">
            <li>中心距(mm)</li>
            <li>外啮合有效齿宽(mm)</li>
            <li>内啮合有效齿宽(mm)</li>
          </ul>
          <ul style="height: 100%;width: 20%;position: absolute;right: 20%">
            <li>太阳轮顶圆直径(mm)</li>
            <li>行星轮顶圆直径(mm)</li>
            <li>齿圈顶圆直径(mm)</li>
          </ul>
          <ul style="height: 100%;width: 20%;position: absolute;right: 0">
            <li>太阳轮实际齿宽(mm)</li>
            <li>行星轮实际齿宽(mm)</li>
            <li>齿圈实际齿宽(mm)</li>
          </ul>
        </div>

        <div style="text-align: right">
          <ul style="height: 100%;width: 20%;position: absolute;left: -2%">
            <li><input v-model="from1.x1_c33" type="text" /></li>
            <li><input v-model="from1.x1_c34" type="text" /></li>
            <li><input v-model="from2.x1_c60" type="text" /></li>
            <li><input v-model="from2.x1_c61" type="text" /></li>
          </ul>
          <ul style="height: 100%;width: 20%;position: absolute;left: 19%">
            <li><input v-model="from3.normal_module" type="text" /></li>
            <li><input v-model="from1.x1_c30" type="text" /></li>
            <li><input v-model="from3.press_angle" type="text" /></li>
          </ul>
          <ul style="height: 100%;width: 20%;position: absolute;left: 39%">
            <li><input v-model="from1.x1_c36" type="text" /></li>
            <li><input v-model="from1.x1_c37" type="text" /></li>
            <li><input v-model="from2.x1_c63" type="text" /></li>
          </ul>
          <ul style="height: 100%;width: 20%;position: absolute;right: 21%">
            <li><input v-model="from1.x1_c41" type="text" /></li>
            <li><input v-model="from1.x1_c39" type="text" /></li>
            <li><input v-model="from2.x1_c65" type="text" /></li>
          </ul>
          <ul style="height: 100%;width: 20%;position: absolute;right: 1%">
            <li><input v-model="from3.width" type="text" /></li>
            <li><input v-model="from4.width" type="text" /></li>
            <li><input v-model="from5.width" type="text" /></li>
          </ul>
        </div>

      </div>
    </div>
  </a-row>

  <a-row class="row_2" style="height: 120%;width: 105%">
    <a-col span="24"  style="height: 100%;width: 100%">
      <div class="col_all">
        <div class="down_1">
          <div>
            <strong><label class="title2">太阳轮/行星轮外啮合</label></strong>
          </div>
          <div class="down_top">
            <div class="title5">输入参数</div>

            <div style="display: flex;margin-top: 8px;height: 100%">
              <div style="text-align: right;">
                <ul style="height: 100%;width: 100%">
                  <li style="font-size: 12px">传递功率(kw)</li>
                  <li style="font-size: 12px">太阳轮转速(rpm)</li>
                  <li style="font-size: 12px">润滑油粘度输入方式</li>
                  <div style="position: relative;height: 25.5%">
                   <div v-show="from1.pp1==1" style="position: absolute;z-index: 1">
                  <li style="font-size: 12px">工作温度(℃)</li>
                  <li style="font-size: 12px">润滑油牌号</li>
                  <li style="font-size: 12px">润滑油工作粘度(mm2/s)</li>
                   </div>
                   <div style="position: absolute;z-index: 2">
                    <li v-show="from1.pp1==2" style="font-size: 12px">润滑油工作粘度(mm2/s)</li>
                   </div>
                  </div>
                  <li style="font-size: 12px">外啮合工作螺旋角</li>
                  <li style="font-size: 12px">内啮合工作啮合角</li>
                  <li style="font-size: 12px">太阳轮节圆直径(mm)</li>
                  <li style="font-size: 12px">行星轮外啮合节圆直径</li>
                </ul>
              </div>

              <div>
                <ul style="text-align: center">
                  <li><input v-model="from1.x1_c29" type="text" style="width: 70%"/></li>
                  <li><input v-model="from1.x1_c31" type="text" style="width: 70%"/></li>
                  <li>
                    <select v-model="from1.pp1" style="height: 25px;border-radius: 2px;width: 70%;">
                      <option value="1">自动计算</option>
                      <option value="2">手动输入</option>
                    </select>
                  </li>

                  <div style="position: relative;height: 100px">
                  <div style="position: absolute;z-index: 1;">
                  <li><input v-show="from1.pp1==1" v-model="from1.x1_c32" type="text" style="width: 70%"/></li>
                  <li>
                    <select v-show="from1.pp1==1" v-model="from1.dd" style="height: 25px;border-radius: 2px;width: 70%;">
                      <option value="1">IOS VG 22</option>
                      <option value="2">IOS VG 32</option>
                      <option value="3">IOS VG 46</option>
                      <option value="4">IOS VG 68</option>
                      <option value="5">IOS VG 100</option>
                      <option value="6">IOS VG 150</option>
                      <option value="7">IOS VG 220</option>
                      <option value="8">IOS VG 320</option>
                      <option value="9">IOS VG 460</option>
                      <option value="10">IOS VG 680</option>
                      <option value="11">IOS VG 1000</option>
                      <option value="12">IOS VG 1500</option>
                    </select>
                  </li>
                    <li v-show="from1.pp1==1">{{from2.x1_c58}}</li>
                  </div>
                  <div style="position: absolute;z-index: 2">
                    <li><input v-show="from1.pp1==2" v-model="from1.vom" type="text" style="width: 70%"/></li>
                  </div>
                  </div>
                    <li>0</li>
                    <li>0</li>
                    <li>246.2142857</li>
                    <li>519.7857143</li>
                </ul>
              </div>
            </div>
        </div>
          <div class="botton_1">
            <button class="comp" @click="geta1">计算</button>
          </div>

          <div class="down_bottom">
            <div class="title6">输出参数</div>

            <div style="display: flex;margin-top: 8px;height: 100%">
              <div style="text-align: right;margin-right: 20px">
                <ul style="height: 100%;width: 100%">
                  <li>线速度(m/s)</li>
                  <li>载荷强度(N/mm2)</li>
                  <li>啮合摩擦系数</li>
                  <li>啮入处的滑动比</li>
                  <li>啮出处的滑动比</li>
                  <li>啮合机械效率系数</li>
                  <li>单对齿啮合功率损失(kW)</li>
                  <li>太阳/行星啮合总损失(kW)</li>
                </ul>
              </div>

              <div>
                <ul style="text-align: center">
                  <li>{{ans1.x1_c44}}</li>
                  <li>{{ans1.x1_c45}}</li>
                  <li>{{ans1.x1_c46}}</li>
                  <li>{{ans1.x1_c47}}</li>
                  <li>{{ans1.x1_c48}}</li>
                  <li>{{ans1.x1_c49}}</li>
                  <li>{{ans1.x1_c50}}</li>
                  <li>{{ans1.x1_c51}}</li>
                </ul>
              </div>

            </div>
          </div>


      </div>
        <div class="down_2">
          <div>
            <strong><label class="title3">行星轮/齿圈内啮合</label></strong>
          </div>
            <div class="down_top">
              <div class="title5">输入参数</div>

              <div style="display: flex;margin-top: 8px;height: 100%">
                <div style="text-align: right;">
                  <ul style="height: 100%;width: 100%">
                    <li style="font-size: 12px">传递功率(kw)</li>
                    <li style="font-size: 12px">行星轮转速(rpm)</li>
                    <li style="font-size: 12px">润滑油工作粘度(mm2/s)</li>
                    <li style="font-size: 12px">外啮合工作螺旋角</li>
                    <li style="font-size: 12px">内啮合工作啮合角</li>
                    <li style="font-size: 12px">行星轮外啮合节圆直径</li>
                    <li style="font-size: 12px">齿圈节圆直径(mm)</li>
                  </ul>
                </div>

                <div>
                  <ul style="text-align: center">
                    <li><input v-model="from2.x1_c55" type="text" style="width: 70%"/></li>
                    <li><input v-model="from2.x1_c57" type="text" style="width: 70%"/></li>
                    <li>{{from2.x1_c58}}</li>
                    <li>0</li>
                    <li>0</li>
                    <li>519.7857143</li>
                    <li>1285.785714</li>
                  </ul>
                </div>
              </div>
            </div>
            <div class="botton_1">
              <button class="comp" @click="geta2">计算</button>
            </div>

            <div class="down_bottom">
              <div class="title6">输出参数</div>

              <div style="display: flex;margin-top: 8px;height: 100%">
                <div style="text-align: right;margin-right: 20px">
                  <ul style="height: 100%;width: 100%">
                    <li>线速度(m/s)</li>
                    <li>载荷强度(N/mm2)</li>
                    <li>啮合摩擦系数</li>
                    <li>啮入处的滑动比</li>
                    <li>啮出处的滑动比</li>
                    <li>啮合机械效率系数</li>
                    <li>单对齿啮合功率损失(kW)</li>
                    <li>行星/齿圈啮合总损失(kW)</li>
                    <li>行星轮系啮合总损失(kW)</li>
                  </ul>
                </div>

                <div>
                  <ul style="text-align: center">
                    <li>{{ans2.x1_c70}}</li>
                    <li>{{ans2.x1_c71}}</li>
                    <li>{{ans2.x1_c72}}</li>
                    <li>{{ans2.x1_c73}}</li>
                    <li>{{ans2.x1_c74}}</li>
                    <li>{{ans2.x1_c75}}</li>
                    <li>{{ans2.x1_c76}}</li>
                    <li>{{ans2.x1_c77}}</li>
                    <li>{{ans2.x1_c79}}</li>
                  </ul>
                </div>

              </div>
            </div>

        </div>
        <div class="down_3">
          <div>
            <strong><label class="title3">太阳轮搅油风阻损失</label></strong>
          </div>
          <div class="down_top">
            <div class="title5">输入参数</div>

            <div style="display: flex;margin-top: 8px;height: 100%;position: relative">
              <div style="text-align: right;position: absolute;right: 50%">
                <ul style="height: 100%;width: 100%">
                  <li style="font-size: 12px;margin-right: 22px">是否浸油</li>
                  <div style="position: relative;height: 67px">
                  <div style="position: absolute;z-index: 1">
                  <li v-show="from3.pp3==2" style="font-size: 12px">光滑轴长(mm)</li>
                  <li v-show="from3.pp3==2" style="font-size: 12px">轴光滑外径(mm)</li>
                  </div>
                  <div style="position: absolute;z-index: 2">
                    <li v-show="from3.pp3==1" style="font-size: 12px">太阳齿轮浸油深度</li>
                    <li v-show="from3.pp3==1" style="font-size: 12px">润滑油工作粘度</li>
                  </div>
                  </div>
                  <li style="font-size: 12px">太阳轮转速(r/min)</li>
                  <li style="font-size: 12px">太阳轮顶圆直径(mm)</li>
                  <li style="font-size: 12px">太阳轮实际齿宽(mm)</li>
                  <li style="font-size: 12px">端面模数(mm)</li>
                  <li style="font-size: 12px">螺旋角(°)</li>
                </ul>
              </div>

              <div style="position: absolute;right: 20%">
                <ul style="text-align: center">
                  <li>
                    <select v-model="from3.pp3" style="height: 25px;border-radius: 2px;width: 110%;">
                      <option value="1">是</option>
                      <option value="2">否</option>
                    </select>
                  </li>
                  <div style="position: relative;height: 67px">
                  <div style="position: absolute;z-index: 1">
                  <li><input v-show="from3.pp3==2" v-model="from3.length" type="text" style="width: 110%"/></li>
                  <li><input v-show="from3.pp3==2" v-model="from3.diameter" type="text" style="width:110%"/></li>
                  </div>
                  <div style="position: absolute;z-index: 2">
                    <li><input v-show="from3.pp3==1" v-model="from3.depth" type="text" style="width: 110%"/></li>
                    <li ><input v-show="from3.pp3==1" v-model="from3.dd" type="text" style="width: 110%"/></li>
                  </div>
                  </div>
                  <li>312.34693</li>
                  <li>{{from3.tip_diameter}}</li>
                  <li>{{from3.width}}</li>
                  <li>{{from3.normal_module}}</li>
                  <li>{{from3.helix_angle}}</li>
                </ul>
              </div>
            </div>
          </div>
          <div class="botton_1">
            <button class="comp" @click="geta3">计算</button>
          </div>

          <div class="down_bottom">
            <div class="title6">输出参数</div>

            <div style="display: flex;margin-top: 40px;height: 100%">
              <div style="text-align: right;margin-right: 20px">
                <ul style="height: 100%;width: 100%">
                  <li v-show="from3.pp3==1">浸油系数</li>
                  <li>齿面粗糙度系数</li>
                  <li>齿面功率损失(kw)</li>
                  <li>齿面侧面功率损失(kw)</li>
                  <li>光滑外表面功率损失(kw)</li>

                  <div style="position: relative">
                  <div style="position: absolute;z-index: 1;margin-left: 35px">
                  <li v-show="from3.pp3==2">风阻损失(kw)</li>
                  </div>
                  <div style="position: absolute;z-index: 2;margin-left: 25px">
                    <li v-show="from3.pp3==1">搅油风阻损失(kw)</li>
                  </div>
                  </div>

                </ul>
              </div>

              <div>
                <ul style="text-align: center">
                  <li v-show="from3.pp3==1">{{ans3.dip_factor}}</li>
                  <li>{{ans3.roughness}}</li>
                  <li>{{ans3.surfaces_loss}}</li>
                  <li>{{ans3.sides_loss}}</li>
                  <li>{{ans3.outside_loss}}</li>
                  <li v-show="from3.pp3==2">{{ans3.churningloss}}</li>
                  <li v-show="from3.pp3==1">{{ans3.windageloss}}</li>
                </ul>
              </div>

            </div>
          </div>
        </div>
        <div class="down_4">
          <strong><label class="title3">行星轮搅油风阻损失</label></strong>
          <div class="down_top">
            <div class="title5">输入参数</div>

            <div style="display: flex;margin-top: 8px;height: 100%;position: relative">
              <div style="text-align: right;position: absolute;right: 50%">
                <ul style="height: 100%;width: 100%">
                  <li style="font-size: 12px;margin-right: 22px">是否浸油</li>
                  <div style="position: relative;height: 67px">
                    <div style="position: absolute;z-index: 1">
                      <li v-show="from4.pp5==2" style="font-size: 12px">光滑轴长(mm)</li>
                      <li v-show="from4.pp5==2" style="font-size: 12px">轴光滑外径(mm)</li>
                    </div>
                    <div style="position: absolute;z-index: 2">
                      <li v-show="from4.pp5==1" style="font-size: 12px">行星轮浸油深度</li>
                      <li v-show="from4.pp5==1" style="font-size: 12px">润滑油工作粘度</li>
                    </div>
                  </div>
                  <li style="font-size: 12px">行星轮转速(r/min)</li>
                  <li style="font-size: 12px">行星轮顶圆直径(mm)</li>
                  <li style="font-size: 12px">行星轮实际齿宽(mm)</li>
                  <li style="font-size: 12px">端面模数(mm)</li>
                  <li style="font-size: 12px">螺旋角(°)</li>
                </ul>
              </div>

              <div style="position: absolute;right: 20%">
                <ul style="text-align: center">
                  <li>
                    <select v-model="from4.pp5" style="height: 25px;border-radius: 2px;width: 110%;">
                      <option value="1">是</option>
                      <option value="2">否</option>
                    </select>
                  </li>
                  <div style="position: relative;height: 67px">
                    <div style="position: absolute;z-index: 1">
                      <li><input v-show="from4.pp5==2" v-model="from4.length" type="text" style="width: 110%"/></li>
                      <li><input v-show="from4.pp5==2" v-model="from4.diameter" type="text" style="width:110%"/></li>
                    </div>
                    <div style="position: absolute;z-index: 2">
                      <li><input v-show="from4.pp5==1" v-model="from4.depth" type="text" style="width: 110%"/></li>
                      <li ><input v-show="from4.pp5==1" v-model="from4.dd" type="text" style="width: 110%"/></li>
                    </div>
                  </div>
                  <li>312.34693</li>
                  <li>{{from3.tip_diameter}}</li>
                  <li>{{from3.width}}</li>
                  <li>{{from3.normal_module}}</li>
                  <li>{{from3.helix_angle}}</li>
                </ul>
              </div>
            </div>
          </div>
          <div class="botton_1">
            <button class="comp" @click="geta4">计算</button>
          </div>

          <div class="down_bottom">
            <div class="title6">输出参数</div>

            <div style="display: flex;margin-top: 40px;height: 100%">
              <div style="text-align: right;margin-right: 20px">
                <ul style="height: 100%;width: 100%">
                  <li v-show="from4.pp3==1">浸油系数</li>
                  <li>齿面粗糙度系数</li>
                  <li>齿面功率损失(kw)</li>
                  <li>齿面侧面功率损失(kw)</li>
                  <li>光滑外表面功率损失(kw)</li>

                  <div style="position: relative">
                    <div style="position: absolute;z-index: 1;margin-left: 35px">
                      <li v-show="from4.pp3==2">风阻损失(kw)</li>
                    </div>
                    <div style="position: absolute;z-index: 2;margin-left: 25px">
                      <li v-show="from4.pp3==1">搅油风阻损失(kw)</li>
                    </div>
                  </div>

                </ul>
              </div>

              <div>
                <ul style="text-align: center">
                  <li v-show="from4.pp3==1">{{ans4.dip_factor}}</li>
                  <li>{{ans4.roughness}}</li>
                  <li>{{ans4.surfaces_loss}}</li>
                  <li>{{ans4.sides_loss}}</li>
                  <li>{{ans4.outside_loss}}</li>
                  <li v-show="from4.pp3==2">{{ans4.churningloss}}</li>
                  <li v-show="from4.pp3==1">{{ans4.windageloss}}</li>
                </ul>
              </div>

            </div>
          </div>
        </div>
        <div class="down_5">
          <div>
            <strong><label class="title3">齿圈搅油风阻损失</label></strong>
          </div>
          <div class="down_top">
            <div class="title5">输入参数</div>

            <div style="display: flex;margin-top: 8px;height: 100%;position: relative">
              <div style="text-align: right;position: absolute;right: 50%">
                <ul style="height: 100%;width: 100%">
                  <li style="font-size: 12px;margin-right: 22px">是否浸油</li>
                  <div style="position: relative;height: 67px">
                    <div style="position: absolute;z-index: 1">
                      <li v-show="from5.pp6==2" style="font-size: 12px">光滑轴长(mm)</li>
                      <li v-show="from5.pp6==2" style="font-size: 12px">轴光滑外径(mm)</li>
                    </div>
                    <div style="position: absolute;z-index: 2">
                      <li v-show="from5.pp6==1" style="font-size: 12px">齿圈轮浸油深度</li>
                      <li v-show="from5.pp6==1" style="font-size: 12px">润滑油工作粘度</li>
                    </div>
                  </div>
                  <li style="font-size: 12px">齿圈转速(r/min)</li>
                  <li style="font-size: 12px">齿圈顶圆直径(mm)</li>
                  <li style="font-size: 12px">齿圈实际齿宽(mm)</li>
                  <li style="font-size: 12px">端面模数(mm)</li>
                  <li style="font-size: 12px">螺旋角(°)</li>
                </ul>
              </div>

              <div style="position: absolute;right: 20%">
                <ul style="text-align: center">
                  <li>
                    <select v-model="from5.pp6" style="height: 25px;border-radius: 2px;width: 110%;">
                      <option value="1">是</option>
                      <option value="2">否</option>
                    </select>
                  </li>
                  <div style="position: relative;height: 67px">
                    <div style="position: absolute;z-index: 1">
                      <li><input v-show="from5.pp6==2" v-model="from5.length" type="text" style="width: 110%"/></li>
                      <li><input v-show="from5.pp6==2" v-model="from5.diameter" type="text" style="width:110%"/></li>
                    </div>
                    <div style="position: absolute;z-index: 2">
                      <li><input v-show="from5.pp6==1" v-model="from5.depth" type="text" style="width: 110%"/></li>
                      <li ><input v-show="from5.pp6==1" v-model="from5.dd" type="text" style="width: 110%"/></li>
                    </div>
                  </div>
                  <li>312.34693</li>
                  <li>{{from3.tip_diameter}}</li>
                  <li>{{from3.width}}</li>
                  <li>{{from3.normal_module}}</li>
                  <li>{{from3.helix_angle}}</li>
                </ul>
              </div>
            </div>
          </div>
          <div class="botton_1">
            <button class="comp" @click="geta5">计算</button>
          </div>

          <div class="down_bottom">
            <div class="title6">输出参数</div>

            <div style="display: flex;margin-top: 40px;height: 100%">
              <div style="text-align: right;margin-right: 20px">
                <ul style="height: 100%;width: 100%">
                  <li v-show="from5.pp3==1">浸油系数</li>
                  <li>齿面粗糙度系数</li>
                  <li>齿面功率损失(kw)</li>
                  <li>齿面侧面功率损失(kw)</li>
                  <li>光滑外表面功率损失(kw)</li>

                  <div style="position: relative">
                    <div style="position: absolute;z-index: 1;margin-left: 35px">
                      <li v-show="from5.pp3==2">风阻损失(kw)</li>
                    </div>
                    <div style="position: absolute;z-index: 2;margin-left: 25px">
                      <li v-show="from5.pp3==1">搅油风阻损失(kw)</li>
                    </div>
                  </div>

                </ul>
              </div>

              <div>
                <ul style="text-align: center">
                  <li v-show="from5.pp3==1">{{ans5.dip_factor}}</li>
                  <li>{{ans5.roughness}}</li>
                  <li>{{ans5.surfaces_loss}}</li>
                  <li>{{ans5.sides_loss}}</li>
                  <li>{{ans5.outside_loss}}</li>
                  <li v-show="from5.pp3==2">{{ans5.churningloss}}</li>
                  <li v-show="from5.pp3==1">{{ans5.windageloss}}</li>
                </ul>
              </div>

            </div>
          </div>
        </div>
      </div>
    </a-col>
  </a-row>
  </div>
</template>

<script>


import {
  lubricate_xingxinglunxi1,
  lubricate_xingxinglunxi2,
  lubricate_xingxinglunxi3,
  lubricate_xingxinglunxi4, lubricate_xingxinglunxi5
} from "@/api/file";

export default {
  created() {
    document.title='行星轮系齿轮功率损失'
  },
  name: "lubricate_xingxinglunxi",
  data(){
    return{
      //一般这里是要封装在一个对象里面的，
      from1:{
        x1_c29:2283,
        x1_c30:0,
        x1_c31:312.34593,
        x1_c32:76.6,
        x1_c33:27,
        x1_c34:57,
        x1_c35:4,
        x1_c36:383,
        x1_c37:220,
        x1_c38:21.9631,
        x1_c39:534.87,
        x1_c41:267.6077,
        pp1:1,//润滑油粘度输入方式（下拉选项）1- 自动计算；2-手动输入
        dd:1,//润滑油牌号（下拉选项）1-IOS VG 22（v40=22;v100=4.15995 ）；2-IOS VG 329（v40=32;v100=5.307541 ）；3-IOS VG 46（v40=46;v100=6.720011 ）；4-IOS VG 68（v40=68;v100=8.664472 ）；5-IOS VG 100（v40=100;v100=11.13384 ）；6-IOS VG 150（v40=150;v100=14.49237 ）；7-IOS VG 220（v40=220;v100=18.59037 ）；8-IOS VG 320（v40=320;v100=23.71884 ）；9-IOS VG 460（v40=460;v100=30.03102 ）；10-IOS VG 680（v40=680;v100=38.72061 ）；11-IOS VG 1000（v40=1000;v100=49.75593 ）；12-IOS VG 1500（v40=1500;v100=64.76486 ）

      },
      ans1:{
        x1_c44:"Text",
        x1_c45:"Text",
        x1_c46:"Text",
        x1_c47:"Text",
        x1_c48:"Text",
        x1_c49:"Text",
        x1_c50:"Text",
        x1_c51:"Text"
      },
      from2:{
        x1_c55:1601,
        x1_c56:0,
        x1_c57:125.84855,
        x1_c59:57,
        x1_c60:141,
        x1_c61:4,
        x1_c62:383,
        x1_c63:220,
        x1_c64:21.9631,
        x1_c65:1265.348,
        x1_c67:534.87,
        x1_c51:8.17009,
        dc:76.6,
        x1_c58:6.93642,
        pp1:1,
        dd:1
      },
      ans2:{
        x1_c70:"Text",
        x1_c71:"Text",
        x1_c72:"Text",
        x1_c73:"Text",
        x1_c74:"Text",
        x1_c75:"Text",
        x1_c76:"Text",
        x1_c77:"Text",
        x1_c79:"Text"
      },
      from3:{
        pp1:1,
        z_s:27,
        z_p:57,
        z_r:141,
        normal_module:11,
        press_angle:21.9631,
        work_center:383,
        pp3:2,
        vom:6.93642,
        depth:87,
        speed:312.34693,
        dd:1,
        outer_diameter:267.6077,
        width:220,
        helix_angle:0,
        tip_diameter:267.6077,
        diameter:87,
        length:87,
        dc:76.6
  },
      ans3:{
        dip_factor:"Text",
        roughness:"Text",
        surfaces_loss:"Text",
        sides_loss:"Text",
        outside_loss:"Text",
        churningloss:"Text",

       // roughness:"Text",
        surfaces:"Text",
       // sides_loss:"Text",
        smooth_loss:"Text",
        windageloss:"Text"

      },
      from4:{
        pp1:1,
        z_s:27,
        z_p:57,
        z_r:141,
        normal_module:11,
        press_angle:21.9631,
        work_center:383,
        pp5:2,
        vom:6.93642,
        depth:0,
        speed:312.34693,
        dd:	6.93642,
        outer_diameter:267.6077,
        width:220,
        helix_angle:0,
        tip_diameter:267.6077,
        diameter:87,
        length:87,
        dc:76.6
      },
      ans4:{
        dip_factor:"Text",
        roughness:"Text",
        surfaces_loss:"Text",
        sides_loss:"Text",
        outside_loss:"Text",
        churningloss:"Text",

        // roughness:"Text",
        surfaces:"Text",
        // sides_loss:"Text",
        smooth_loss:"Text",
        windageloss:"Text"
      },
      from5:{
        pp1:1,
        z_s:27,
        z_p:57,
        z_r:141,
        normal_module:11,
        press_angle:21.9631,
        work_center:383,
        pp6:2,
        vom:6.93642,
        depth:87,
        speed:312.34693,
        dd:1,
        outer_diameter:267.6077,
        width:220,
        helix_angle:0,
        tip_diameter:267.6077,
        diameter:87,
        length:87,
        dc:76.6
      },
      ans5:{
        dip_factor:"Text",
        roughness:"Text",
        surfaces_loss:"Text",
        sides_loss:"Text",
        outside_loss:"Text",
        churningloss:"Text",
        // roughness:"Text",
        surfaces:"Text",
        // sides_loss:"Text",
        smooth_loss:"Text",
        windageloss:"Text"
      }
    };
  },
  methods:{
    geta1(){
      //这个括号里面可以传参，一般就是传你this.form的内容
      lubricate_xingxinglunxi1(this.from1)
          .then(res => {//这里需要用箭头函数，如果不用箭头函数里面的this就不是外面那个this
            console.log(res);
                this.ans1.x1_c44=res[0];
                this.ans1.x1_c45=res[1];
                this.ans1.x1_c46=res[2];
                this.ans1.x1_c47=res[3];
                this.ans1.x1_c48=res[4];
                this.ans1.x1_c49=res[5];
                this.ans1.x1_c50=res[6];
                this.ans1.x1_c51=res[7];
            //你也可以不检验，这个状态码一般是检验后端数据有没有异常，res就是返回结果的整个大的对象
     /*       if (res.code === 200) {
              console.log(res.data);
              //然后再把这里面的数据放到你绑定的对象动态改变值即可
              this.ans1 = res.data;
            }*/

          })
          .catch(error => {
            console.log(error);
          });
    },
    geta2(){
      //这个括号里面可以传参，一般就是传你this.form的内容
      lubricate_xingxinglunxi2(this.from2)
          .then(res => {//这里需要用箭头函数，如果不用箭头函数里面的this就不是外面那个this
            console.log(res);
            this.ans2.x1_c70=res[0];
            this.ans2.x1_c71=res[1];
            this.ans2.x1_c72=res[2];
            this.ans2.x1_c73=res[3];
            this.ans2.x1_c74=res[4];
            this.ans2.x1_c75=res[5];
            this.ans2.x1_c76=res[6];
            this.ans2.x1_c77=res[7];
            this.ans2.x1_c79=res[8];
            //你也可以不检验，这个状态码一般是检验后端数据有没有异常，res就是返回结果的整个大的对象
         /*   if (res.code === 200) {
              console.log(res.data);
              //然后再把这里面的数据放到你绑定的对象动态改变值即可
              this.ans2 = res.data;
            }*/
          })
          .catch(error => {
            console.log(error);
          });
    },
    geta3(){
      //这个括号里面可以传参，一般就是传你this.form的内容
      lubricate_xingxinglunxi3(this.from3)
          .then(res => {//这里需要用箭头函数，如果不用箭头函数里面的this就不是外面那个this
            console.log(res);
            this.ans3.dip_factor=res[0];
            this.ans3.roughness=res[1];
            this.ans3.surfaces_loss=res[2];
            this.ans3.sides_loss=res[3];
            this.ans3.outside_loss=res[4];
            this.ans3.churningloss=res[5];
            // roughness:"Text",
            this.ans3.surfaces=res[6];
            // sides_loss:"Text",
            this.ans3.smooth_loss=res[7];
            this.ans3.windageloss=res[8];
            //你也可以不检验，这个状态码一般是检验后端数据有没有异常，res就是返回结果的整个大的对象
        /*    if (res.code === 200) {
              console.log(res.data);
              //然后再把这里面的数据放到你绑定的对象动态改变值即可
              this.ans3 = res.data;
            }*/
          })
          .catch(error => {
            console.log(error);
          });
    },
    geta4(){
      //这个括号里面可以传参，一般就是传你this.form的内容
      lubricate_xingxinglunxi4(this.from4)
          .then(res => {//这里需要用箭头函数，如果不用箭头函数里面的this就不是外面那个this
            console.log(res);
            this.ans4.dip_factor=res[0];
            this.ans4.roughness=res[1];
            this.ans4.surfaces_loss=res[2];
            this.ans4.sides_loss=res[3];
            this.ans4.outside_loss=res[4];
            this.ans4.churningloss=res[5];
            // roughness:"Text",
            this.ans4.surfaces=res[6];
            // sides_loss:"Text",
            this.ans4.smooth_loss=res[7];
            this.ans4.windageloss=res[8];
            //你也可以不检验，这个状态码一般是检验后端数据有没有异常，res就是返回结果的整个大的对象
        /*    if (res.code === 200) {
              console.log(res.data);
              //然后再把这里面的数据放到你绑定的对象动态改变值即可
              this.ans4 = res.data;
            }*/
          })
          .catch(error => {
            console.log(error);
          });
    },
    geta5(){
      //这个括号里面可以传参，一般就是传你this.form的内容
      lubricate_xingxinglunxi5(this.from5)
          .then(res => {//这里需要用箭头函数，如果不用箭头函数里面的this就不是外面那个this
            console.log(res);
            this.ans5.dip_factor=res[0];
            this.ans5.roughness=res[1];
            this.ans5.surfaces_loss=res[2];
            this.ans5.sides_loss=res[3];
            this.ans5.outside_loss=res[4];
            this.ans5.churningloss=res[5];
            // roughness:"Text",
            this.ans5.surfaces=res[6];
            // sides_loss:"Text",
            this.ans5.smooth_loss=res[7];
            this.ans5.windageloss=res[8];
            //你也可以不检验，这个状态码一般是检验后端数据有没有异常，res就是返回结果的整个大的对象
       /*     if (res.code === 200) {
              console.log(res.data);
              //然后再把这里面的数据放到你绑定的对象动态改变值即可
              this.ans5 = res.data;
            }*/
          })
          .catch(error => {
            console.log(error);
          });
    },
  }
}
</script>

<style scoped>
.top_all{
  width: 100%;
  height: 100%;
  margin-left: 8px;
  margin-right: 8px;
  box-shadow: 1.5px 1.5px 2px #aaaaaa;
  border-radius: 3px;
  border: 0.5px solid rgba(231,231,231,0.486);
}
.col_all{
  position: relative;
  height: 100%;
  width: 100%;
  margin-top: 8px;
  margin-left: 8px;
}
.down_1{
  height: 100%;
  width: 19.5%;
  position: absolute;
  box-shadow: 1.5px 1.5px 2px #aaaaaa;
  border-radius: 3px;
  border: 0.5px solid rgba(231,231,231,0.486);
}
.down_2{
  height: 100%;
  width: 19.5%;
  position: absolute;
  left: 20%;
  box-shadow: 1.5px 1.5px 2px #aaaaaa;
  border-radius: 3px;
  border: 0.5px solid rgba(231,231,231,0.486);
}
.down_3{
  height: 100%;
  width: 20%;
  position: absolute;
  left: 40%;
  box-shadow: 1.5px 1.5px 2px #aaaaaa;
  border-radius: 3px;
  border: 0.5px solid rgba(231,231,231,0.486);
}
.down_4{
  height: 100%;
  width: 19.5%;
  position: absolute;
  right: 20%;
  box-shadow: 1.5px 1.5px 2px #aaaaaa;
  border-radius: 3px;
  border: 0.5px solid rgba(231,231,231,0.486);
}
.down_5{
  height: 100%;
  width: 19.5%;
  position: absolute;
  right: 0;
  box-shadow: 1.5px 1.5px 2px #aaaaaa;
  border-radius: 3px;
  border: 0.5px solid rgba(231,231,231,0.486);
}
.title1{
  width: 100%;
  padding-right:94.1%;
  background-color: #D7D7D7;
  font-size: 17.5px;
}
.title2{
  width: 100%;
  height: 5.2%;
  background-color: #D7D7D7;
  font-size: 17.5px;
  border-radius: 5px;
  padding-left: 3%;
}
.title3{
  width: 100%;
  height: 5.2%;
  background-color: #D7D7D7;
  font-size: 17.5px;
  border-radius: 5px;
  padding-left: 3%;
}
.title4{
  width: 100%;
  height: 3.2%;
  background-color: #D7D7D7;
  font-size: 17.5px;
  border-radius: 5px;
  padding-left: 3%;
}
.title5{
  width: 100%;
  height: 5.7%;
  background-color: #D7D7D7;
  font-size: 17.5px;
  border-radius: 5px;
  padding-left: 3%;
}
.title6{
  width: 100%;
  height: 7%;
  background-color: #D7D7D7;
  font-size: 17.5px;
  border-radius: 5px;
  padding-left: 3%;
}
.down_top{
  height: 50%;
  width: 96%;
  margin-left: 5px;
  margin-right: 5px;
  box-shadow: 1.5px 1.5px 2px #aaaaaa;
  border-radius: 3px;
  border: 0.5px solid rgba(231,231,231,0.486);
  position: absolute;
  top: 5%;
}
.botton_1{
  margin-top: 8px;
  right:3%;
  top: 55%;
  position: absolute;
  background-color: #16D585;
}
.down_bottom{
  height: 40%;
  width: 96%;
  margin-top: 13%;
  margin-right: 5px;
  margin-left: 5px;
  box-shadow: 1.5px 1.5px 2px #aaaaaa;
  border-radius: 3px;
  border: 0.5px solid rgba(231,231,231,0.486);
  position: absolute;
  bottom: 0;
}
.comp{
  background-color: #16D585;
  height: 20px;
}
</style>
